<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>订单</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<meta http-equiv="expires" content="0">
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<link href="../../../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../../../css/reset.css" />
		<link rel="stylesheet" href="../../../css/cmms.css" />
		<link rel="stylesheet" href="../../../css/iconfont.css?time=20190123" />
		<link rel="stylesheet" href="../../../css/mui.picker.min.css" />
		<link rel="stylesheet" href="../../../css/sale/order/order.css?time=20190123" />
		<script src="../../../js/vconsole.min.js"></script>
	</head>

	<body>
		<div id="order" v-cloak>
			<!--<div class="noOrdertip" v-show="isTip">
				<span><i class="iconfont icon-iconfonticon3"></i></span>
				<span>温馨提示:为保证标本正常送检，请您及时汇款或确认订单，谢谢!</span>
				<span @tap="deltip"><i class="iconfont icon-shanchu"></i></span>
			</div>-->
			<div class="heightBox" v-show="isTip"></div>
			<!--搜素-->
			<div class="topSearch">
				<div class="selectRange">
					<div @tap="selectState">
						{{selState}}<i class="icon iconfont icon-jiantou"></i>
					</div>
				</div>
				<input type="text" v-model="doctorName" placeholder="请输入客户或医生或患者" />
				<button class="btn-primary right" @tap="searchItem">搜索</button>
			</div>
			<!--列表-->
			<div class="orderList" v-show="show">
				<!--首页今日订单进入-->
				<ul class="orderListItem" v-for="list in orderList">
					<div class="detail" @tap="reportDetail(list.orderId)">
						<li class="row1">
						<span class="name">{{list.patientName}}</span>
						<span class="date">{{list.submitTime|replaceT}}</span>
						<span class="right basic-color">
							<i class="icon iconfont icon-shijian-"></i>
							{{list.orderState+""|formatState}}
						</span>
					</li>
					<li class="row2">
						检验条形码：<span>{{list.specimenBarCode.join(',')}}</span>
					</li>
					<li class="row3">
						<span>{{list.projectNmae.join(',')}}</span>
					</li>
					<li class="row4">
						<span>共<span class="basic-color">{{list.projectNum}}</span>个检验项目<span class="basic-color">¥{{list.amount}}</span></span>
						<span class="right">
							<i class="icon iconfont icon-icon1 basic-color"></i>
							{{list.doctorName}}
						</span>
					</li>
					</div>
					<li class="row6" >
						<p v-if="list.orderState==4||list.orderState==8||list.orderState==11">
							<span @tap="reportPDF(list.orderId)" >
								<i class="icon iconfont icon-tubiaozhizuomoban10 basic-color"></i>JPEG报告
							</span>
						</p>
						<p>
							<span class="saler">业务员:{{list.saleName}}</span>
							<span class="creater" v-if="list.true==true">代录员:{{list.creatorName}}</span>
						</p>
					</li>
				</ul>
				<!--未确认订单列表-->
				<ul class="mui-table-view panel" v-show="orderTip>0&&unConfirmList.length>0"> 
			        <li class="mui-table-view-cell mui-collapse">
			            <a class="mui-navigate-right" href="#">
			            	<p>您有{{orderTip}}个订单待确认！</p>
			            	<p>(为保证标本正常送检,请您及时回款或确认订单)</p>
			            </a>
			            <div class="mui-collapse-content">
			                <ul class="orderListItem" v-for="(unConfirm,index) in unConfirmList" >
								<li class="row1"  @tap="selectOne(unConfirm.orderId,index)">
									<i class="iconfont icon-tubiaozhizuomoban left" 
										:class="{'icon-xuanzhong':unConfirm.show}"></i>
									<span class="name">{{unConfirm.patientName}}</span>
									<span class="date">{{unConfirm.submitTime|replaceT}}</span>
									<span class="right basic-color">
										<i class="icon iconfont icon-shijian-"></i>
										{{unConfirm.orderState+""|formatState}}
									</span>
								</li>
								<div class="detail" @tap="reportDetail(unConfirm.orderId)">
									<li class="row2">
										检验条形码：<span>{{unConfirm.specimenBarCode.join(',')}}</span>
									</li>
									<li class="row3">
										<span>{{unConfirm.projectNmae.join(',')}}</span>
									</li>
									<li class="row4">
										<span>共<span class="basic-color">{{unConfirm.projectNum}}</span>个检验项目<span class="basic-color">¥{{unConfirm.amount}}</span></span>
										<span class="right">
											<i class="icon iconfont icon-icon1 basic-color"></i>
											{{unConfirm.doctorName}}
										</span>
									</li>
								</div>
								<!--<li class="row5" v-if='list.orderState==1'>
									<button class="btn-detail right cancelOrder"  @tap="confirmOrder(list.orderId)">确认订单</button>
									<span class="btn-detail right cancelOrder"  @tap="del(list.orderId)">取消订单</span>
								</li>-->
								<li class="row6" >
									<p>
										<span class="saler">业务员:{{unConfirm.saleName}}</span>
										<span class="creater" v-if="unConfirm.true==true">代录员:{{unConfirm.creatorName}}</span>
									</p>
									<p>
										<span @tap="del(unConfirm.orderId)"><i class="iconfont icon-icon2 right"></i></span>
									</p>
								</li>
							</ul>
			            </div>
			        </li>
			        <p><button class="btn-detail cancelOrder" @tap="confirmOrder">确认订单</button></p>
			    </ul>
				<ul class="orderListItem" v-for="list in confirmList" v-if='list.orderState!=1&&confirmList.length>0'>
					<div class="detail" @tap="reportDetail(list.orderId)">
						<li class="row1">
						<span class="name">{{list.patientName}}</span>
						<span class="date">{{list.submitTime|replaceT}}</span>
						<span class="right basic-color">
							<i class="icon iconfont icon-shijian-"></i>
							{{list.orderState+""|formatState}}
						</span>
					</li>
					<li class="row2">
						检验条形码：<span>{{list.specimenBarCode.join(',')}}</span>
					</li>
					<li class="row3">
						<span>{{list.projectNmae.join(',')}}</span>
					</li>
					<li class="row4">
						<span>共<span class="basic-color">{{list.projectNum}}</span>个检验项目<span class="basic-color">¥{{list.amount}}</span></span>
						<span class="right">
							<i class="icon iconfont icon-icon1 basic-color"></i>
							{{list.doctorName}}
						</span>
					</li>
					</div>
					<!--<li class="row5" v-if='list.orderState==1'>
						<button class="btn-detail right cancelOrder"  @tap="confirmOrder(list.orderId)">确认订单</button>
						<span class="btn-detail right cancelOrder"  @tap="del(list.orderId)">取消订单</span>
					</li>-->
					<li class="row6" >
						<p v-if="list.orderState==4||list.orderState==8||list.orderState==11||list.orderState==14||list.orderState==15||list.orderState==16">
							<span @tap="reportPDF(list.orderId)" >
								<i class="icon iconfont icon-tubiaozhizuomoban10 basic-color"></i>JPEG报告
							</span>
						</p>
						<p>
							<span class="saler">业务员:{{list.saleName}}</span>
							<span class="creater" v-if="list.true==true">代录员:{{list.creatorName}}</span>
						</p>
					</li>
				</ul>
			</div>
			<!--未找到数据-->
			<div class="notFind" v-show="!show">
				<img src="../../../img/notFind.png" alt="未找到对应的数据" />
				<p>暂无数据</p>
			</div>
		</div>
	
		<script src="../../../js/mui.min.js"></script>
		<script src="../../../js/vue.js"></script>
		<script src="../../../js/mui.picker.min.js"></script>
		<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
		<script src="../../../js/cmms.js?time=222"></script>
		<script type="text/javascript">
			mui.init()
		</script>
		<script type="text/javascript">
			new Vue({
				el:"#order",
				data:{
					selState:'全部',
					selStateNum:'',
					doctorName:'',
					orderList:[],//订单列表
					orderTip:0,
					orderIds:[],//未确认订单id集合数
					show:false,
					urlArr:[],//报告地址
					confirm:0,//是否确认订单
					isTip:false,
					menuName:'',//判断哪个地方进入
					confirmList:[],
					unConfirmList:[],
					userId:'',
					fromPage:'',//订单页有无确认订单
					id:''
				},
				mounted(){
//					var vConsole = new VConsole();
					this.init();
					this.getUrl();
					this.getPages();
				},
				methods:{
					init(){
						let _this=this;
						/*调用微信接口配置location.href.split('#')[0]*/
						AT.muiAjax('/partner-sale/partnerSale/wxConfig','post',{url:location.href.split('#')[0],appId:'wx50a81908477971c2'},function(res){
							wx.config({
								//debug: true,
								appId:res.appId,
								timestamp:res.timestamp,
								nonceStr:res.nonceStr,
								signature:res.signature,
								jsApiList:['previewImage']
							});
						});
						//获取userID
						AT.muiAjax('/partner-sale/statistics/getHome','post',{},function(res){
							console.log(res);
							
							_this.userId = res.id;
						});
					},
					getUrl(){
						let _this=this;
						var url = location.search; //获取url中"?"符后的字串    
						var theRequest = new Object();  
//						console.log(url);
					   	if (url.indexOf("?") != -1) {   
					      var str = url.substr(1);  
//					      console.log(str);
					      strs = str.split("&");  
					      for(var i = 0; i < strs.length; i ++) {   
					         theRequest[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);   
					      } 
					   	}   
					   	console.log(theRequest);
					   	_this.menuName = theRequest.name;
					   	_this.fromPage = theRequest.fromPage;
					   	_this.id = theRequest.id;
					},
					getPages(){
						/*获取页面*/
						let _this=this;
						
						//加载页面数据
						if(_this.menuName=="todayOrder"){
							AT.muiAjax('/partner-sale/order/getDoctorOrderByToday','post',{
								name:_this.doctorName,
								orderState:_this.selStateNum
							},function(res){
								_this.orderList = res;
								if(_this.orderList.length>0){
									_this.show=true;
								}else{
									_this.show=false;
								}
							});
						}else if(_this.menuName=="clinicOrder"){
							AT.muiAjax('/partner-sale/order/getOrderByHospitalId','post',{
								id:_this.id,
								name:_this.doctorName,
								orderState:_this.selStateNum
							},function(res){
								_this.orderList = res;
								if(_this.orderList.length>0){
									_this.show=true;
								}else{
									_this.show=false;
								}
							});
						}
						else{
							AT.muiAjax('/partner-sale/order/getDoctorOrder','post',{
								name:_this.doctorName,
								orderState:_this.selStateNum
							},function(res){
								let unConfirmArrs = res.unConfirmList;
								let orderIds = [];
								for(let i=0;i<unConfirmArrs.length;i++){
									unConfirmArrs[i].show = true;
									orderIds.push(unConfirmArrs[i].orderId);
								}
								_this.orderIds = orderIds;								
								console.log(_this.orderIds);
//								console.log(unConfirmArrs);
								_this.unConfirmList = unConfirmArrs;
								_this.confirmList = res.confirmList;
								
								console.log(res);
								if(_this.confirmList.length>0||_this.unConfirmList.length>0){
									_this.show=true;
								}else{
									_this.show=false;
								}
							});
						}
						//未确认订单数
						AT.muiAjax('/partner-sale/order/getCountUnConfirm','post',{},function(res){
							console.log(res);
							_this.orderTip = res;
							//未确认订单数存在，显示提示信息
							if(_this.orderList.length>0){
								if(res>0){
									_this.isTip = true;
								}else{
									_this.isTip = false;
								}
							}else{
								_this.isTip = false;
							}
						});
					},
					/*单选一项*/
					selectOne(id,index){
						let _this =this;
						let orderSizeSum=0;
						let orderIds = [];
						for(let order of _this.unConfirmList){
							if(order.orderId==id){
								if(order.show==true){
									order.show = false;
								}else{
									order.show = true;
								}
							}
							if(order.show){
								orderSizeSum++;
								orderIds.push(order.orderId);
								
							}
						}
						_this.orderIds = orderIds;
						console.log(_this.orderIds);
						
//						console.log(orderSizeSum);
//						console.log(_this.unConfirmList);
					},
					/*搜索*/
					searchItem(){
						this.getPages();
					},
					/*获取PDF报告*/
					reportPDF(orderId){
						let _this=this;
						_this.urlArr = [];
						AT.muiAjax('/partner-sale/order/getOrderReportByOrderId','post',{
							id:orderId
						},function(res){
							if(res.length==0){
								mui.alert('报告未出');
							}else{
								let jpgList = res.jpgList;
								for(let i of jpgList){
									let url='https://api.lis.ulabcare.com/api/common/common/downLoadFile?type=0&fileName=1&attachId='+i;
									_this.urlArr.push(url);
								}
								console.log(_this.urlArr);
								_this.getImg();
							}
						});
					},
					/*调用微信接口展示图片*/
					getImg(){
						let _this=this;
						wx.previewImage({
							current: _this.urlArr[0], // 当前显示图片的http链接
							urls: _this.urlArr// 需要预览的图片http链接列表
						});
					},
					/*状态选择*/
					selectState:function(){
						let _this = this;
						var picker = new mui.PopPicker();
						picker.setData([
							{value:'',text:'全部'},
							{value:'1',text:'未支付'},
							{value:'5',text:'支付中'},
							{value:'13',text:'已支付'},
							{value:'9',text:'送检中'},
							{value:'10',text:'检验中'},
							{value:'11',text:'生成报告'},
							{value:'12',text:'已取消'}
						]);
						picker.show(function (selectItems) {
						    _this.selState=selectItems[0].text;
						    _this.selStateNum=selectItems[0].value;
						    _this.getPages();
						})
					},
					reportDetail(id){
						location.href = "./../orderDetail.html?id="+id+"&userId="+this.userId;
					},
					/*取消订单*/
					del(id){
						console.log(id)
						let _this = this;
						mui.confirm("确定要取消这条订单么？",'取消订单',['再考虑一下','取消订单'],function(con){
							if(con.index===1){
								AT.muiAjax('/partner-sale/order/delOrderStateById','post',{id},function(res){
									mui.toast(res)
									const timer = setTimeout(() =>{                    
										location.reload();              
									}, 1000);  
									_this.$once('hook:beforeDestroy', () => {            
									    clearTimeout(timer);                                    
									});
								})
							}
						})
					},
					//确认订单
					confirmOrder(){
						let _this = this;
						mui.confirm("确定这条订单么？",'确认订单',['再考虑一下','确认订单'],function(con){
							if(con.index===1){
								AT.muiAjax('/partner-sale/order/updOrderStateById','post',{
									orderIds:_this.orderIds
								},function(res){
//									console.log(res);
									mui.toast("确认订单成功!");
									const timer = setTimeout(() =>{                    
										location.reload();              
									}, 1000);  
									_this.$once('hook:beforeDestroy', () => {            
									    clearTimeout(timer);                                    
									});
								})
							}
						})
					},
					//关闭提示框
					deltip(){
						this.isTip = false;
					}
				}
			})
		</script>
	</body>

</html>